<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<t:base type="jquery,easyui,tools,DatePicker"></t:base>
<%@include file="/context/regionpicker.jsp"%>
<script type="text/javascript" src="${webRoot}/plug-in/regionpicker/init_region.js"></script>
<link type="text/css" rel="stylesheet" href="${webRoot}/css/cityLayout.css?version=20160501"/>
<style>

    #depart input, #depart select{
        line-height: 14px;
        height: 30px;
        width: 200px;
    }
</style>
<t:formvalid formid="formobj" dialog="true" usePlugin="password" layout="table" action="departController.do?saveShunt">
    <input type="hidden" id="id" name="id" value="${depart.id}">
    <table id="depart" style="width: 600px;" cellpadding="0" cellspacing="1" class="formtable">
        <tr>
            <td align="right" >
                <label class="Validform_label">组织机构名:</label>
            </td>
            <td class="value">
                <input class="inputxt" id="departname" onchange="changeDepartName()" name="departname" datatype="*" value="${depart.departname}">
                <input class="inputxt" id="orgCode" name="orgCode" type="hidden" value="${depart.orgCode}">
                <input class="inputxt" id="orgType" name="orgType" value="${depart.orgType}" type="hidden">
            </td>
        </tr>
       <%-- <tr>
            <td align="right" >
                <label class="Validform_label">组织机构编码:</label>
            </td>
            <td class="value">
                <input class="inputxt" id="orgCode" name="orgCode" datatype="*" value="${depart.orgCode}">
            </td>
        </tr>--%>
        <%--<tr>
            <td align="right" >
                <label class="Validform_label">组织类型:</label>
            </td>
            <td class="value">
                <input class="inputxt" id="orgType" name="orgType" datatype="*" value="${depart.orgType}">
            </td>
        </tr>--%>
        <tr>
            <td align="right" >
                <label class="Validform_label">联系电话:</label>
            </td>
            <td class="value">
                <input class="inputxt" id="mobile" name="mobile" value="${depart.mobile}" datatype="/^1\d{10}$/" errormsg="电话不正确" ignore="ignore">
            </td>
        </tr>
        <tr>
            <td align="right" >
                <label class="Validform_label">组织机构类型:</label>
            </td>
            <td class="value">
                <select id="departType" name="departType" onchange="changeByDepartType(this.value)">
                    <option value="1" <c:if test="${departType=='1'}">selected="selected"</c:if>>门店</option>
                    <option value="2" <c:if test="${departType=='2'}">selected="selected"</c:if>>区域</option>
                    <%--<option value="0" <c:if test="${departType=='0'}">selected="selected"</c:if>>部门</option>--%>
                </select>
            </td>
        </tr>
        <tr id="parent_tr">
            <td align="right" >
                <label class="Validform_label">父组织机构类型:</label>
            </td>
            <td class="value">
                <select id="parentDepart" name="parentDepart" datatype="*">
                    <option value=''>请选择</option>
                    <c:forEach var="item" items="${departsZones}">
                        <option value="${item.id}">${item.departname}</option>
                    </c:forEach>
                </select>
            </td>
        </tr>
        <tr>
            <td align="right" >
                <label class="Validform_label">区域:</label>
            </td>
            <td class="value">
                <input type="text" id="area"
                       class="cargoSelect proCityQueryAll proCitySelAll" value="${depart.area}" datatype="*" readonly="true"/>
                <input type="hidden" id="areaCode" name="areaCode" value="${depart.areaCode}"/>
            </td>
        </tr>
        <tr>
            <td align="right" >
                <label class="Validform_label">详细地址:</label>
            </td>
            <td class="value">
                <input class="inputxt" id="address" name="address" datatype="*" value="${depart.address}" readonly="true" nullmsg="请选择详细地址！">
            </td>
        </tr>
        <tr>
            <td align="right" >
                <label class="Validform_label">是否400门店:</label>
            </td>
            <td class="value">
                <select id="head" name="head">
                    <option value="0" <c:if test="${head=='0'}">selected="selected"</c:if>>否</option>
                    <option value="1" <c:if test="${head=='1'}">selected="selected"</c:if>>是</option>
                </select>
            </td>
        </tr>
        <tr>
            <td align="right" >
                <label class="Validform_label">备注:</label>
            </td>
            <td class="value">
                <input class="inputxt" id="remark" name="remark" datatype="s0-100" value="${depart.remark}">
            </td>
        </tr>
    </table>
    <input type="hidden" id="lat" name="lat" class="point lat" value="${depart.lat}">
    <input type="hidden" id="lng" name="lng" class="point lng" value="${depart.lng}">
    <div id="map" style="width: 500px;height: 300px;margin-left: 50px;"></div>
</t:formvalid>

<script type="text/javascript">
    function changeByDepartType(value){
        if(value!=1){
            $("#parentDepart").val("");
            $("#parentDepart").attr("disabled","disabled");
            $("#parentDepart").removeAttr("datatype");
            $("#orgType").val("1");
            $("#head").attr("disabled","disabled");
            $("#head").val("0");
        }else{
            $("#parentDepart").removeAttr("disabled");
            $("#parentDepart").attr("datatype","*");
            $("#head").removeAttr("disabled");
        }
        vaildDepartName();
    }
    function changeDepartName() {
        vaildDepartName();
    }
    function vaildDepartName() {
        var data={};
        data["departName"]=$("#departname").val();
        data["departType"]=$("#departType").val();
        data["id"]=$("#id").val();
        $.post('departController.do?departCount',data,function (e) {
            var d = $.parseJSON(e);
            if (!d.success) {
                $("#departname").addClass("Validform_error");
                var spanObj = $("#departname").parent().children("span");
                spanObj.addClass("Validform_wrong").text("名称已存在");
            }
        });
    }
    // 创建Map实例
    var mp;
    function initialize() {
        // 创建点坐标和缩放级别
        mp = new BMap.Map('map');
        mp.centerAndZoom(new BMap.Point(121.491, 31.233), 11);
        //启用滚轮放大缩小
        mp.enableScrollWheelZoom();
        var geoc = new BMap.Geocoder();
        mp.addEventListener("click", function(e){
            var marker = new BMap.Marker(
                    new BMap.Point(e.point.lng, e.point.lat)); //创建点
            mp.clearOverlays(); //清除覆盖物
            mp.addOverlay(marker); //增加点
            //监听事件，提示标注点坐标信息
            $("#lat").val(e.point.lat);
            $("#lng").val(e.point.lng);
            geoc.getLocation(e.point, function(rs){
                if(rs.address!=null){
                    $("#address").val(rs.address);
                }
            });
            console.log("您标注的位置：" +
                    e.point.lng + ", " +
                    e.point.lat);
        });
        var myCity = new BMap.LocalCity();
        myCity.get(setLocal);
    }
    function setLocal(result){
        var cityName = result.name;
        mp.setCenter(cityName);
    }
    function loadScript() {
        var script = document.createElement("script");
        script.src = "http://api.map.baidu.com/api?v=2.0&ak=OqnggeyDRIT4sebfOFgx1zjXSVMYI0Yj&callback=initialize";
        document.body.appendChild(script);
    }
    window.onload = loadScript;
    $(function () {
        var orgType =  $("#orgType").val();
        if(orgType==''){
            $("#orgType").val("2");
        }
        if($("#id").val()!=""){
            $("#parentDepart").val('${depart.parentdepartid}');
        }
        //init_region();
        var gAddress=$("#area").val();
        $(document).mouseup(function () {
            setTimeout(function(){
                var localAddreaa = $("#area").val();
                if(gAddress==localAddreaa){
                    return;
                }
                else{
                    gAddress=localAddreaa;
                    if(localAddreaa!=""){
                        panToMap(localAddreaa);
                    }
                }
            },1);

        });
        function panToMap(address){
            var rows = address.split("-");
            var reg = new RegExp("-","g");//g,表示全部替换
            var searchAddress = address.replace(reg,"");
            // 创建地址解析器实例
            var myGeo = new BMap.Geocoder();
            // 将地址解析结果显示在地图上,并调整地图视野
            myGeo.getPoint(searchAddress, function(point){
                if (point) {
                    mp.centerAndZoom(point, 16);
                    mp.panTo(point);
                }
            }, rows[1]);
        }
    });
</script>

